class Des{
  constructor(){
    this.pic=document.querySelector('.pic>img')
    this.dtl=document.querySelector('.dtl')
    this.big=document.querySelector('.box>img')
    this.h4=document.querySelector('h4')
    this.p=document.querySelector('.cribe')
    this.price=document.querySelector('.price')
    this.init()
  }
  init(){
    this.request()

  }
  Searchstr(name){
    let str=location.search
    let obj={}
    let arr=str.split('?')[1]
    arr=arr.split('&')
    arr.forEach(item=>{
      let newArr=item.split('=')
      obj[newArr[0]]=newArr[1]
    })
    return obj[name]

  }
  request(){
    let id=this.Searchstr('id')
    P_AJAX({ url: '../libs/goods.json' })
    .then(res=>{
      let data=JSON.parse(res)
      data=data.splice(120,240)
      data.forEach(item=>{
       if(item.goods_id==id){
         this.render(item)
       }
      })
    })
  }
  render(data){
    this.pic.src=data.img_small_logo
    this.big.src=data.img_big_logo
    this.dtl.innerHTML = data.goods_introduce
    this.h4.innerHTML=data.category
    this.p.innerHTML='商品介绍：<br>'+data.title
    this.price.innerHTML='价格：￥'+data.price
  }
}
new Des()


const box=document.querySelector('.pic')
const span=document.querySelector('span')
const bigbox=document.querySelector('.box')
const bigboximg=document.querySelector('.box>img')
const container=document.querySelector('.content')
box.onmouseover=function(){
  span.style.display='block'
  bigbox.style.display='block'
}
box.onmouseout=function(){
  span.style.display='none'
  bigbox.style.display='none'
}
box.onmousemove=function(event){
event=event || window.event
let x=event.pageX-container.offsetLeft-span.offsetWidth/2
let y=event.pageY-container.offsetTop-span.offsetHeight/2
if(x<0){
  x=0
}else if(x>box.offsetWidth-span.offsetWidth){
  x=box.offsetWidth-span.offsetWidth
}
if(y<0){
  y=0
}else if(y>box.offsetHeight-span.offsetHeight){
  y=box.offsetHeight-span.offsetHeight
}
span.style.left=x+'px'
span.style.top=y+'px'
 let w=x/(box.offsetWidth-span.offsetWidth)*(bigboximg.offsetWidth-bigbox.offsetWidth)
 let h=y/(box.offsetHeight-span.offsetHeight)*(bigboximg.offsetHeight-bigbox.offsetHeight)
bigboximg.style.left=-w+'px'
bigboximg.style.top=-h+'px'
}


let data = JSON.parse(localStorage.getItem('cart')) || []
